<template>
    <h2>event的类型ts</h2>
    <button @click="handelBtn(10,20)">普通事件函数</button>
    <hr>
    <input type="text" @change="changeInput">
</template>
<script setup lang='ts'>
import { ref,reactive,onMounted} from 'vue'
//普通事件，类型 返回值类型
const handelBtn = (a:any,b:number)=>{
    console.log(a,b);
}
//事件对象
//'event'隐式的类型为"any"
// const changeInput = (event:any)=>{
//     console.log(event.target.value);
// }
//或者 类型断言
const changeInput = (event:Event)=>{
    console.log((event.target as HTMLInputElement).value);
}
onMounted(()=>{
    document.querySelector("div")//鼠标悬停 HTMLDivElement
    document.querySelector("input")//鼠标悬停 HTMLInputElement
    document.querySelector("span")//鼠标悬停 HTMLSpanElement
    document.querySelector("ul")//鼠标悬停 HTMLUListElement
})
</script>
<style scoped lang='scss'>
</style>